<template>
  <!-- 文化活动 -->
  <base-breadcrumb :title="$route.meta.title">
    <!-- 搜索 -->
    <searchData
      :search-data="searchArr"
      @search="search"
    />
    <!-- 表格 -->
    <a-card :bordered="false">
      <!-- <title-name :title="$route.meta.title" /> -->

      <!-- 表格 -->
        <list-table
            ref="table"
            :columns="columns"
            :request="loadData"
            :alert="true"
            row-key="id"
        >
        <template
          slot="operation"
          slot-scope="text, record"
        >
          <a
            v-if="record.executeStatus == 1"
            @click="handleManage(record)"
          >处理异常</a>
        </template>
        <template
          slot="requestParam"
          slot-scope="text"
        >
          <a class="ellipsis-box" @click="openModal(text)">{{ text }}</a>
        </template>
        <template
          slot="responseParam"
          slot-scope="text"
        >
          <a class="ellipsis-box" @click="openModal(text)">{{ text }}</a>
        </template>
        <template
          slot="thirdErrorMsg"
          slot-scope="text"
        >
          <a class="ellipsis-box" @click="openModal(text)">{{ text }}</a>
        </template>
      </list-table>
    </a-card>
  </base-breadcrumb>
</template>

<script>
import { getPageExceptionDealRecord, handleException } from '@/api/system/logRecord'

import { STable } from '@/components' // 表格
const searchArr = [
    // {
    //     name: '执行状态',
    //     type: 'select',
    //     value: 'executeStatus',
    //     data: [
    //         { value: 1, label: '启用' },
    //         { value: 2, label: '停止' }
    //     ]
    // },
    {
        name: '线程ID',
        type: 'input',
        value: 'threadId'
    },
    {
        name: '	请求来源',
        type: 'select',
        value: 'source',
        data: [
            { value: 1, label: '客户服务对接' },
            { value: 2, label: '局质量管理对接' },
            { value: 3, label: '局工程设计接口对接' }
        ]
    }
]
const columns = [
    {
        title: '序号',
        width: 80,
        dataIndex: 'index',
        customRender() {
            return arguments[2] + 1
        }
    },
    {
        title: '线程ID',
        dataIndex: 'threadId',
        ellipsis: true
    },
    {
        title: '类名',
        ellipsis: true,
        dataIndex: 'className'
    },
    {
        title: '方法名',
        ellipsis: true,
        dataIndex: 'methodName'
    },
    {
        title: '创建时间',
        ellipsis: true,
        dataIndex: 'createTime'
    },
    {
        title: '接口描述',
        ellipsis: true,
        dataIndex: 'description'
    },
    // {
    //     title: '执行状态',
    //     ellipsis: true,
    //     dataIndex: 'executeStatus',
    //     customRender(text, record, index) {
    //         return record.executeStatus == 1 ? '启用' : '停止'
    //     }
    // },

    {
        title: '请求参数',
        dataIndex: 'requestParam',
        ellipsis: true,
        scopedSlots: { customRender: 'requestParam' }
    },
    {
        title: '响应参数',
        dataIndex: 'responseParam',
        ellipsis: true,
        scopedSlots: { customRender: 'responseParam' }
    },
    {
        title: '错误描述',
        dataIndex: 'thirdErrorMsg',
        ellipsis: true,
        scopedSlots: { customRender: 'thirdErrorMsg' }
    },
    {
        title: '请求来源',
        dataIndex: 'source',
        ellipsis: true,
        customRender(text, record, index) {
            let tx = ''
            switch (record.source) {
                case 1:
                    tx = '客户服务对接'
                    break
                case 2:
                    tx = '局质量管理对接'
                    break
                case 3:
                    tx = '局工程设计接口对接'
                    break
            }
            return tx
        }
    }

    // {
    //     title: '操作',
    //     dataIndex: 'operation',
    //     width: '180px',
    //     align: 'center',
    //     scopedSlots: { customRender: 'operation' }
    // }
]
export default {
    name: 'a' + Date.now(),
    components: {
        STable
    },
    data() {
        this.columns = columns
        this.searchArr = searchArr
        return {
            queryParam: { type: 2 }, // 查询参数
            totalSize: 0,
            loading: false,
            loadData: (parameter) => {
                const requestParameters = Object.assign({}, parameter, { query: this.queryParam })
                return getPageExceptionDealRecord(requestParameters).then((res) => {
                    return res
                })
            }
        }
    },

    methods: {
        // 搜索
        search(value) {
            value && (this.queryParam = { ...value, type: 2 })
            this.$refs.table.refresh(true)
        },
        // 操作栏
        handleManage(record) {
            console.log(record)
            this.$refs.table.localLoading = true
            handleException({ id: record.id }).then(
                (res) => {
                    this.$refs.table.localLoading = false
                    this.$message.success('处理成功')
                },
                (err) => {
                    this.$refs.table.localLoading = false
                    this.$message.success('处理失败')
                }
            )
        },
        openModal(text) {
            this.$info({
                title: '参数详情',
                okText: '关闭',
                content: text
            })
        }
    }
}
</script>
<style lang="less" scoped>
.ellipsis-box {
    word-break: break-all;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
</style>